﻿<!doctype html>
<html>
<head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="Pragma" content="no-cache" />
    <meta http-equiv="Cache-Control" content="no-cache, must-revalidate" />
    <meta http-equiv="Expires" content="0" />
	<link href="../videos/css/jquery-ui.css" rel="stylesheet">
	<link href="../videos/css/demo.css" rel="stylesheet">
</head>
	<script src="../videos/lib/jquery.js"></script>
	<script src="../videos/lib/jquery-ui.js"></script>
<body>
<div class="left">
    <div id="divPlugin" class="plugin" style="text-align: center">
	</div>
    <fieldset class="login">
        <legend>登录</legend>
        <table cellpadding="0" cellspacing="3" border="0">
            <tr>
                <td class="tt">IP地址</td>
                <td><input id="loginip" type="text" class="txt" value="172.27.1.171" /></td>
                <td class="tt">端口号</td>
                <td><input id="port" type="text" class="txt" value="37777" /></td>
            </tr>
		      	<tr>
                <td class="tt">协议类型</td>
                <td colspan="2">
                    <select id="protocolType" class="sel" onchange="changeProtocol(this.value);">
                        <option value="0">TCP</option>
                        <option value="4">UDP</option>
						<option value="3">组播</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td class="tt">用户名</td>
                <td><input id="username" type="text" class="txt" value="admin" /></td>
                <td class="tt">密码</td>
                <td><input id="password" type="password" class="txt" value="admin123" /></td>
            </tr>
            <tr>
                <td class="tt">RTSP端口</td>
                <td colspan="2"><input id="rtspport" type="text" class="txt" value="80" />（可选参数）</td>
				<td colspan="4">
                    <input type="button" class="btn" value="登录" onclick="clickLogin();" />
                    <input type="button" class="btn" value="退出" onclick="clickLogout();" />
                </td>
            </tr>
		    <tr>
                <td class="tt">已登录设备</td>
                <td>
                    <select id="ips" class="sel" onchange="switchDeviceInfo(this.value);"></select>
                </td>
                <td class="tt">通道列表</td>
                <td>
                    <select id="channels" class="sel"></select>
                </td>
            </tr>
            <tr>
				<td class="tt">窗口分割数</td>
                <td colspan="2">
                    <select id="wndNum" class="sel2" onchange="changeWndNum(this.value);">
                        <option value="1">1x1</option>
                        <option value="2" selected>2x2</option>
                        <option value="3">3x3</option>
                        <option value="4">4x4</option>
                    </select>
                </td>
				<td colspan="4">
                     <input type="button" class="btn" value="全屏" onclick="clickFullScreen();" />
                </td>
            </tr>
        </table>
    </fieldset>
    <fieldset class="localconfig">
        <legend>本地配置</legend>
        <table cellpadding="0" cellspacing="3" border="0">
            <tr>
                <td class="tt">播放性能</td>
                <td>
                    <select id="netsPreach" name="netsPreach" class="sel">
                        <option value="0">最短延时</option>
                        <option value="1">实时性好</option>
                        <option value="2">均衡</option>
                        <option value="3">流畅性好</option>
                    </select>
                </td>
                <td class="tt">图像尺寸</td>
                <td>
                    <select id="wndSize" name="wndSize" class="sel">
                        <option value="0">充满</option>
                        <option value="1">4:3</option>
                        <option value="2">16:9</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td class="tt">规则信息</td>
                <td>
                    <select id="rulesInfo" name="rulesInfo" class="sel">
                        <option value="1">启用</option>
                        <option value="0">禁用</option>
                    </select>
                </td>
                <td class="tt">抓图文件格式</td>
                <td>
                    <select id="captureFileFormat" name="captureFileFormat" class="sel">
                        <option value="0">BMP</option>
                        <option value="1">JEPG</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td class="tt">录像文件保存路径</td>
                <td colspan="3"><input id="LiveRecord" type="text" class="txt" />&nbsp;<input type="button" class="btn" value="浏览" onclick="clickOpenFileDlg('LiveRecord');" /></td>
            </tr>
            <tr>
                <td class="tt">回放下载保存路径</td>
                <td colspan="3"><input id="Download" type="text" class="txt" />&nbsp;<input type="button" class="btn" value="浏览" onclick="clickOpenFileDlg('Download');" /></td>
            </tr>
            <tr>
                <td class="tt">预览抓图保存路径</td>
                <td colspan="3"><input id="LiveSnapshot" type="text" class="txt" />&nbsp;<input type="button" class="btn" value="浏览" onclick="clickOpenFileDlg('LiveSnapshot');" /></td>
            </tr>
            <tr>
                <td class="tt">回放抓图保存路径</td>
                <td colspan="3"><input id="PlaybackPicPath" type="text" class="txt" />&nbsp;<input type="button" class="btn" value="浏览" onclick="clickOpenFileDlg('PlaybackPicPath');" /></td>
            </tr>
            <tr>
                <td class="tt">回放剪辑保存路径</td>
                <td colspan="3"><input id="PlaybackFilePath" type="text" class="txt" />&nbsp;<input type="button" class="btn" value="浏览" onclick="clickOpenFileDlg('playbackFilePath');" /></td>
            </tr>
        </table>
    </fieldset>
    <fieldset class="operate">
        <legend>操作信息</legend>
        <div id="opinfo" class="opinfo"></div>
    </fieldset>
</div>
<div class="left">
    <fieldset class="preview">
        <legend>预览</legend>
        <table cellpadding="0" cellspacing="3" border="0">
            <tr>
                <td class="tt" colspan="1">码流类型</td>
                <td colspan="1">
                    <select id="streamtype" class="sel2" onchange="changeStreamType(this.value);">
                        <option value="1">主码流</option>
                        <option value="2">子码流</option>
                    </select>
                </td>
                <td colspan="1">
                    <input type="button" class="btn" value="开始预览" onclick="clickStartRealPlay();" />
                    <input type="button" class="btn" value="停止预览" onclick="clickStopRealPlay();" />
                </td>
            </tr>
            <!--<tr>
                <td>
                    <input type="button" class="btn" value="开始对讲" onclick="clickStartVoiceTalk();" />
				</td>
				 <td>
                    <input type="button" class="btn" value="停止对讲" onclick="clickStopVoiceTalk();" />
                </td>
				<td>
				</td>
            </tr>-->
        </table>
    </fieldset>
    <fieldset class="preview">
        <legend>音视频控制</legend>
		<table cellpadding="0" cellspacing="3" border="0">
            <!--<tr>
				<td class="tt">
                    <input type="button" class="btn" value="打开声音" onclick="clickOpenSound();" />
                </td>
                <td >
					<input type="button" class="btn" value="关闭声音" onclick="clickCloseSound();" />
				</td>
                <td>
                </td>
            </tr>-->
            <tr>
                <td>
                    <input type="button" class="btn" value="抓图" onclick="clickCapturePic();" />
				</td>
				<td>
                    <input type="button" class="btn" value="开始录像" onclick="clickStartRecord();" />
				</td>
				<td>
                    <input type="button" class="btn" value="停止录像" onclick="clickStopRecord();" />
                </td>
            </tr>
            <tr>
                <td>
                    <input type="button" class="btn2" value="启用电子放大" onclick="clickEnableEZoom();" />
				</td>
				<td>
                    <input type="button" class="btn2" value="禁用电子放大" onclick="clickDisableEZoom();" />
                </td>
				<td>
				</td>
            </tr>
		</table>
	</fieldset>
    <fieldset class="ptz">
	<legend>云台</legend>
	<div id="tabs">
	<ul>
		<li><a href="#tabs-1">云台控制</a></li>
		<!--<li><a href="#tabs-2">预置点</a></li>
		<li><a href="#tabs-3">巡航路线</a></li>
		<li><a href="#tabs-4">巡航预置点</a></li>
		<li><a href="#tabs-5">线扫</a></li>
		<li><a href="#tabs-6">巡迹</a></li>-->
	</ul>
	<div id="tabs-1">
	    <table cellpadding="0" cellspacing="3" border="0" class="left">
            <tr>
                <td>
                    <input type="button" class="btn" value="左上" onmousedown="mouseUPLeftPTZControl(false);" onmouseup="mouseUPLeftPTZControl(true);" />
                    <input type="button" class="btn" value="上" onmousedown="mouseUpPTZControl(false);" onmouseup="mouseUpPTZControl(true);" />
                    <input type="button" class="btn" value="右上" onmousedown="mouseUPRightPTZControl(false);" onmouseup="mouseUPRightPTZControl(true);" />
                </td>
            </tr>
            <tr>
                <td>
                    <input type="button" class="btn" value="左" onmousedown="mouseLefPTZControl(false);" onmouseup="mouseLefPTZControl(true);" />
                    <input type="button" class="btn" id="openPtzLocate" value="开启" onclick="openPtzLocate();" />
					<input type="button" class="btn" id="closePtzLocate" value="关闭" onclick="closePtzLocate();" />
                    <input type="button" class="btn" value="右" onmousedown="mouseRightPTZControl(false);" onmouseup="mouseRightPTZControl(true);" />
                </td>
            </tr>
            <tr>
                <td>
                    <input type="button" class="btn" value="左下" onmousedown="mouseDownLeftPTZControl(false);" onmouseup="mouseDownLeftPTZControl(true);" />
                    <input type="button" class="btn" value="下" onmousedown="mouseDownPTZControl(false);" onmouseup="mouseDownPTZControl(true);" />
                    <input type="button" class="btn" value="右下" onmousedown="mouseDownRightPTZControl(false);" onmouseup="mouseDownRightPTZControl(true);" />
                </td>
            </tr>
        </table>
        <table cellpadding="0" cellspacing="3" border="0" class="left">
            <tr>
                <td class="tt">云台速度</td>
                <td>
                    <select id="ptzspeed" class="sel">
                        <option value="1">1</option>
                        <option value="2">2</option>
                        <option value="3">3</option>
                        <option value="4" selected>4</option>
                        <option value="5">5</option>
                        <option value="6">6</option>
                        <option value="7">7</option>
                    </select>
                </td>
            </tr>
        </table>
        <table cellpadding="0" cellspacing="3" border="0">
            <tr>
                <td class="tt"><input type="button" class="btn2" value="变倍+" onmousedown="PTZZoomIn(false)" onmouseup="PTZZoomIn(true)"></td>
                <td><input type="button" class="btn2" value="变倍-" onmousedown="PTZZoomout(false)" onmouseup="PTZZoomout(true)"></td>
            </tr>
            <tr>
                <td class="tt"><input type="button" class="btn2" value="变焦+" onmousedown="PTZFocusIn(false)" onmouseup="PTZFocusIn(true)"></td>
                <td><input type="button" class="btn2" value="变焦-" onmousedown="PTZFoucusOut(false)" onmouseup="PTZFoucusOut(true)"></td>
            </tr>
            <tr>
                <td class="tt"><input type="button" class="btn2" value="光圈+" onmousedown="PTZIrisIn(false)" onmouseup="PTZIrisIn(true)"></td>
                <td><input type="button" class="btn2" value="光圈-" onmousedown="PTZIrisOut(false)" onmouseup="PTZIrisOut(true)"></td>
            </tr>
        </table>
	</div>
	<div id="tabs-2">
		<!--
        <table cellpadding="0" cellspacing="3" border="0" class="left">
            <tr>
                <td class="tt">预置点列表</td>
                <td>
                    <select id="presetList" class="sel">
                    </select>
                </td>
            </tr>
        </table>
        <table cellpadding="0" cellspacing="3" border="0">
            <tr>
                <td class="tt"><input type="button" class="btn2" value="获取" onmousedown="GetPresets()"></td>
                <td><input type="button" class="btn2" value="定位到" onmousedown="GotoPreset()"></td>
            </tr>
            <tr>
                <td class="tt"><input type="button" class="btn2" value="增加" onmousedown="SetPreset()"></td>
                <td><input type="button" class="btn2" value="删除" onmousedown="RemovePreset()"></td>
            </tr>
        </table>
		<-->
	</div>
	<div id="tabs-3"></div>
	<div id="tabs-4">
	</div>
	<div id="tabs-5">
	</div>
	<div id="tabs-6">
	</div>
	</div>
    </fieldset>
	<!--
    <fieldset class="playback">
        <legend>回放</legend>
        <table width="100%" cellpadding="0" cellspacing="3" border="0">
            <tr>
                <td class="tt">码流类型</td>
                <td>
                    <select id="record_streamtype" class="sel">
                        <option value="1">主码流</option>
                        <option value="2">子码流</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td class="tt">开始时间</td>
                <td>
                    <input id="starttime" type="text" class="txt" value="2013-12-10 00:00:00" />（时间格式：2013-11-11 12:34:56）
                </td>
            </tr>
            <tr>
                <td class="tt">结束时间</td>
                <td>
                    <input id="endtime" type="text" class="txt" value="2013-12-11 23:59:59" />
                    <input type="button" class="btn" value="搜索" onclick="clickRecordSearch(0);" />
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    <div id="searchdiv" class="searchdiv">
                        <table id="searchlist" class="searchlist" cellpadding="0" cellspacing="0" border="0"></table>
                    </div>
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    <input type="button" class="btn2" value="开始回放" onclick="clickStartPlayback();" />
                    <input type="button" class="btn2" value="停止回放" onclick="clickStopPlayback();" />
                    <input type="button" class="btn" value="倒放" onclick="clickReversePlayback();" />
                    <input type="button" class="btn" value="单帧" onclick="clickFrame();" />
                    <input id="transstream" type="checkbox" class="vtop" />&nbsp;启用转码码流
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    <input type="button" class="btn" value="暂停" onclick="clickPause();" />
                    <input type="button" class="btn" value="恢复" onclick="clickResume();" />
                    <input type="button" class="btn" value="慢放" onclick="clickPlaySlow();" />
                    <input type="button" class="btn" value="快放" onclick="clickPlayFast();" />
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    <input type="button" class="btn" value="抓图" onclick="clickCapturePic();" />
                    <input type="button" class="btn2" value="开始剪辑" onclick="clickStartRecord('playback');" />
                    <input type="button" class="btn2" value="停止剪辑" onclick="clickStopRecord('playback');" />
                    <input type="button" class="btn2" value="OSD时间" onclick="clickGetOSDTime();" />&nbsp;<input id="osdtime" type="text" class="txt" readonly />
                </td>
            </tr>
        </table>
    </fieldset>
	<-->
    <!--<fieldset class="playback">
        <legend>人数统计</legend>
		  <table width="100%" cellpadding="0" cellspacing="3" border="0">
            <tr>
                <td class="tt">规则</td>
                <td>
                    <select id="humanFlowRule" class="sel">
                        <option value="0">区域内人数统计</option>
                        <option value="1">人数统计</option>
                    </select>
                </td>
            </tr>
			<tr>
                <td class="tt">跨度</td>
                <td>
                    <select id="humanFlowGranularity" class="sel">
                        <option value="0">日</option>
						<option value="1">月</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td class="tt">开始时间</td>
                <td>
                    <input id="humanFlowStarttime" type="text" class="txt" value="2018-11-22 00:00:00" />（时间格式：2013-11-11 12:34:56）
                </td>
            </tr>
            <tr>
                <td class="tt">结束时间</td>
                <td>
                    <input id="humanFlowEndtime" type="text" class="txt" value="2018-11-22 23:59:59" />
                </td>
            </tr>
			 <tr>
                <td class="tt">滞留时间</td>
                <td>
				 <select id="humanFlowMinStayTime" class="sel">
                        <option value="5">5秒</option>
                        <option value="30">30秒</option>
						<option value="60">60秒</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    <input type="button" class="btn2" value="开启查询" onclick="clickStartTrafficDataQuery();" />
					查询句柄:<input id="humanFlowQueryHandle" type="text" class="txt" value="0" />
                </td>
            </tr>
			 <tr>
                <td>
                    <input type="button" class="btn3" value="获得信息总数" onclick="clickGetTrafficDataTotalCount();" />
                </td>
				<td>
                    信息条数<input id="humanFlowInfoCount" type="text" class="txt" value="0" />
                </td>
            </tr>
			<tr>
				<td>
					<input type="button" class="btn3" value="获得查询信息" onclick="clickQueryTrafficData();" />
				</td>
			</tr>
			<tr>
                <td colspan="2">
                    <input type="button" class="btn3" value="停止查询" onclick="clickStopTrafficDataQuery();" />
                </td>
            </tr>
        </table>
	</fieldset>-->
</div>
<script src="../videos/module/foundation.js"></script>
<script src="../videos/module/WebVideoCtrl.js"></script>
<script src="../videos/module/modifyUI.js"></script>
<script src="../videos/module/demo.js"></script>
</body>
</html>
